/*
 *                        .::::.
 *                      .::::::::.
 *                     :::::::::::
 *                  ..:::::::::::'
 *               '::::::::::::'
 *                 .::::::::::
 *            '::::::::::::::..
 *                 ..::::::::::::.
 *               ``::::::::::::::::
 *                ::::``:::::::::'        .:::.
 *               ::::'   ':::::'       .::::::::.
 *             .::::'      ::::     .:::::::'::::.
 *            .:::'       :::::  .:::::::::' ':::::.
 *           .::'        :::::.:::::::::'      ':::::.
 *          .::'         ::::::::::::::'         ``::::.
 *      ...:::           ::::::::::::'              ``::.
 *     ````':.          ':::::::::'                  ::::..
 *                        '.:::::'                    ':'````..
 *
 * @Author: byx
 * @Date: 2022-08-02 21:15:35
 * @LastEditors: byx
 * @LastEditTime: 2022-10-10 23:13:26
 * @version: 1.0
 * @Descripttion: wwww.byx1024.top
 */

const { defineConfig } = require('@vue/cli-service')
const path = require('path')

//  todo 需要做的功能
//  alert 警告
//  bug BUG问题
//  BUG 大小写兼容
//  note 标记一下 note（笔记）
//  tag 标签
//  check 已完成
//  test 测试中 flame（火焰）
//  ver 优化升级 versions（版本）
//  info 信息
//  xxx unverified（不确定）
module.exports = defineConfig({
  devServer: {
    port: 8080,
    host: 'localhost',
    https: false,
    open: true,
    allowedHosts: 'all'
  },
  transpileDependencies: true,
  // 组件
  pluginOptions: {
    'style-resources-loader': {
      preProcessor: 'less',
      // 哪些文件自动引入，使用绝对路径
      // 需要是path.join来拼接完整路径
      patterns: [path.join(__dirname, './src/assets/styles/variables.less'), path.join(__dirname, './src/assets/styles/mixins.less')]
    }
  },
  // 其他webpack配置
  // 通过chainWebpack 调整内联文件的大小限制
  chainWebpack: (config) => {
    // `url-loader`是webpack默认已经配置的，现在我们来修改它的参数
    // 图片加载 limit是10000字节，就是让10kb之内
    // cmd 中运行：vue inspect --rule images 或 --rules可查看，配置，然后通过.tap方式，修改插件或规则中的内容
    // config.module.rule('images').use('url-loader').loader('url-loader').options({
    //   name: './assets/images/[name].[ext]',
    //   quality: 85,
    //   limit: 0,
    //   esModule: false
    // })
    // config.module
    //   .rule('images')
    //   .use('url-loader')
    //   .loader('url-loader')
    //   .tap((options) => Object.assign(options, { limit: 10000 }))
    // 这个是给 webpack-dev-server开启可IP和域名访问权限。
    // config.devServer.disableHostCheck(true)
    // config.devServer.allowedHosts('all')
  },
  // #这个是设置外部扩展，模块为qc变量名为QC，导入qc将不做打包。
  // 例如：{'vue-router': 'VueRouter'}
  configureWebpack: {
    externals: {
      qc: 'QC'
    }
  }
})
